<!--
 * @Version: 1.0
 * @Date: 2021-04-07 18:42:19
 * @LastEditTime: 2021-05-13 15:37:45
 * @Description:
-->
<template>
  <div>
    <el-dialog
      :center="true"
      :title="title"
      :visible.sync="formVisibleDown"
      width="600px"
      :before-close="() => {$emit('update:formVisibleDown', false)}"
      @open="openDialog"
    >
      <div>
        <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="150px">
          <el-form-item label="选择退货类型" prop="type">
            <el-select v-model="ruleForm.type" style="width:300px" @change="changeType">
              <el-option key="1" :value="1" label="良品" />
              <el-option key="33" :value="2" label="残品" />
            </el-select>
          </el-form-item>
          <el-form-item v-if="ruleForm.type" label="退入仓库" prop="warehouses_id">
            <el-select v-model="ruleForm.warehouses_id" style="width:300px" :disabled="true" placeholder="根据原订单所属店铺绑定仓库，选择实体仓后自动带出虚拟仓">
              <el-option v-for="item in warehouseList" :key="item.id" :label="item.name" :value="item.warehouse_fictitious_id" />
            </el-select>
          </el-form-item>
        </el-form>
        <div style="text-align: center; margin-top:50px">
          <el-button type="primary" :loading="isbtn" @click="submitForm('ruleForm')">保存</el-button>
          <el-button @click="handleCancelDown">取消</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { warehousesSubclass } from '@/utils/publicData'
export default {
  props: {
    formVisibleDown: {
      type: Boolean,
      default: false
    },
    title: {
      type: String,
      default: '退入仓库'
    },
    id: {
      type: String,
      default: ''
    },
    amount: {
      type: String,
      default: ''
    },
    data: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      warehouseList: [],
      warehouseListData: [],
      isbtn: false,
      ruleForm: {
        type: '',
        warehouses_id: '' // 虚拟仓库id
      },
      rules: {
        type: [
          { required: true, message: '请输入选择', trigger: 'change' }
        ],
        warehouses_id: [
          { required: true, message: '店铺暂无仓库可选，请绑定店铺仓库', trigger: 'change' }
        ]
      }
    }
  },

  methods: {
    openDialog() {
      Object.keys(this.ruleForm).forEach(k => {
        this.ruleForm[k] = ''
      })
      warehousesSubclass(this.data.shop_id, this.data.storage_id).then((data) => {
        this.warehouseListData = data
      })
    },
    changeType(val) {
      this.ruleForm.warehouses_id = ''
      if (val === 1) {
        this.warehouseList = this.warehouseListData.virtual
        this.ruleForm.warehouses_id = this.warehouseList[0].warehouse_fictitious_id
      } else {
        this.warehouseList = this.warehouseListData.remnant.map((arr) => {
          arr.warehouse_fictitious_id = arr.id
          return arr
        })
        this.ruleForm.warehouses_id = this.warehouseList[0].warehouse_fictitious_id
      }
    },
    // 关闭
    handleCancelDown() {
      this.$emit('update:formVisibleDown', false)
      this.$refs['ruleForm'].resetFields()
    },
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          const data = this.ruleForm
          if (this.data.type === 4) {
            this.recallWarehous(this.data.id, data)
          }
          if (this.data.type === 2) {
            this.returnsWarehous(this.data.id, data)
          }
        } else {
          console.log('error submit!!')
          return false
        }
      })
    },
    // 退货入库 afterSaleOrders/returnsWarehous
    returnsWarehous(id, data) {
      this.$http.post(`/afterSaleOrders/returnsWarehous/${id}`, data).then((res) => {
        if (res.code === 10000) {
          this.$message.success('退货入库成功')
          this.$emit('handleSearch')
          this.handleCancelDown()
        }
      })
    },
    // 召回入库
    recallWarehous(id, data) {
      this.$http.post(`/afterSaleOrders/recallWarehous/${id}`, data).then((res) => {
        if (res.code === 10000) {
          this.$message.success('召回入库成功')
          this.$emit('handleSearch')
          this.handleCancelDown()
        }
      })
    }
  }
}
</script>

 <style lang="scss" scoped>

 </style>
